<template>
  <a-form :label-col="labelCol" :wrapper-col="wrapperCol">
    <a-form-item
      label="计划名称"
    >
      <a-input id="error" placeholder="" />
    </a-form-item>
   
    <a-form-item label="执勤时间" has-feedback validate-status="warning">
      <a-time-picker style="width: 100%" />
    </a-form-item>
    <a-form-item label="执勤班组" has-feedback validate-status="error">
      <a-select default-value="1">
        <a-select-option value="1">
          1队
        </a-select-option>
        <a-select-option value="2">
          2队
        </a-select-option>
        <a-select-option value="3">
          3队
        </a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item
      label="位置"
      has-feedback
      validate-status="validating"
      help="The information is being validated..."
    >
      <a-cascader :default-value="['1']" :options="[]" />
    </a-form-item>
    <a-form-item label="inline" style="margin-bottom:0;">
      <a-form-item
        validate-status="error"
        help="Please select the correct date"
        :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
      >
        <a-date-picker style="width: 100%" />
      </a-form-item>
      <span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }">
        -
      </span>
      <a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
        <a-date-picker style="width: 100%" />
      </a-form-item>
    </a-form-item>
    
  </a-form>
</template>
<script>
export default {
  data() {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
      },
    };
  },
};
</script>